import '../../sass/auth/MenuEdit.scss';
import router from '../../router/Index.js';

export default {
    data(){
        var validateTitle = (rule, value, callback) => {
            if (value === '') {
                callback(new Error('请输入菜单标题'));
            } else {
                if(value.length > 20){
                    callback(new Error('菜单标题不能超过二十个字'));
                }else{
                    callback();
                }
            }
        };
        return {
            id:'',
            baseForm: {
                title:'',
                pid:'',
                url:'',
                icon:'',
                order:0,
                status:true
            },
            temp_data: {},
            baseInfo:{

            },
            type:'添加',
            rules: {
                title: [
                    { validator: validateTitle, trigger: 'blur' }
                ]
            },
            loading:false,
            dialogTableVisible: false,
            parent:[]
        }
    },
    components:{

    },
    computed: {

    },
    created:function () {

    },
    mounted:function () {
        if(this.$route.query.id) {
            this.id = this.$route.query.id;
            this.type = '编辑';
        }
        this.fetchData();
    },
    methods: {
        async fetchData() {
            let _this=this,response,_response;
            let url = '/backend/menu/detail';
            this.loading = true;
            try {
                response = await fetch(url, {
                    method: 'POST',
                    headers: {
                        'Accept': 'application/json',
                        'Content-type': "application/json",
                    },
                    credentials: 'same-origin',
                    body:JSON.stringify({
                        'id' : _this.id,
                    })
                });
                _response = await response.json();

                if(_response.code===0){
                    _this.baseInfo = _response.data.detail;
                    _this.parent = _response.data.parent;
                    if(_this.baseInfo){
                        _this.setParams(_this.baseInfo);
                    }
                }else if(_response.code ===-2){
                    _this.$message({
                        message: _response.msg,
                        type: 'error'
                    });
                }else if(_response.code ===-999){
                    _this.$message({
                        message: _response.msg,
                        type: 'error'
                    });
                    setTimeout(function () {
                        window.location.reload();
                    },1500);
                }
                _this.loading = false;
            } catch(err) {
                _this.$message({
                    message: '调用接口失败',
                    type: 'error'
                });
                _this.loading = false;
            }
        },
        submitForm(formName) {
            let _this = this;
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    if(_this.id > 0 ) {
                        var data = {
                            id:_this.id,
                            pid: _this.baseForm.pid,
                            title: _this.baseForm.title,
                            order: _this.baseForm.order,
                            icon: _this.baseForm.icon,
                            url: _this.baseForm.url,
                            status: _this.baseForm.status,
                        };
                    }else{
                        var data = {
                            pid: _this.baseForm.pid,
                            title: _this.baseForm.title,
                            icon: _this.baseForm.icon,
                            order: _this.baseForm.order,
                            url: _this.baseForm.url,
                            status: _this.baseForm.status,
                        };
                    }
                    _this.saveData(data);
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
        async saveData(data) {
            let _this=this,response,_response;
            let url = "";
            if(_this.id > 0 ) {
                url = '/backend/menu/edit';
            }else{
                url = '/backend/menu/save';
            }
            this.loading = true;
            try {
                response = await fetch(url, {
                    method: 'POST',
                    headers: {
                        'Accept': 'application/json',
                        'Content-type': "application/json",
                    },
                    credentials: 'same-origin',
                    body:JSON.stringify(data)
                });
                _response = await response.json();

                if(_response.code===0){
                    _this.$message({
                        message: _response.msg,
                        type: 'success'
                    });
                    _this.backToMenu();
                }else if(_response.code ===-2){
                    _this.$message({
                        message: _response.msg,
                        type: 'error'
                    });
                    _this.loading = false;
                }else if(_response.code ===-999) {
                    _this.$message({
                        message: _response.msg,
                        type: 'error'
                    });
                    setTimeout(function () {
                        window.location.reload();
                    }, 1500);
                }
            } catch(err) {
                _this.$message({
                    message: '调用接口失败',
                    type: 'error'
                });
                _this.loading = false;
            }
        },
        resetForm(formName) {
            if(this.id > 0){
                this.setParams(this.baseInfo);
            }else{
                this.$refs[formName].resetFields();
            }
        },
        removeItem(item,name) {
            var index = this.baseForm[name].indexOf(item);
            if (index !== -1) {
                this.baseForm[name].splice(index, 1)
            }
        },
        addItem(name) {
            this.baseForm[name].push({
                value: '',
                key: Date.now()
            });
        },
        setParams(data) {
            this.baseForm.pid = data.pid;
            if(this.baseForm.pid == 0){
                this.baseForm.pid = '';
            }
            this.baseForm.url = data.url;
            this.baseForm.icon = data.icon;
            this.baseForm.title = data.title;
            this.baseForm.order = data.order;
            if (data.status === 1) {
                this.baseForm.status = true;
            } else {
                this.baseForm.status = false;
            }
        },
        backToMenu(){
            router.push({path:'/auth/menu'});
        },
    }
}